<!-- 报告审核项目档案列表 -->
<template>
  <a-card :bordered="false">
    <div>
      <a-table
        ref="table"
        size="middle"
        :scroll="{x:scrollX}"
        bordered
        :components="draggableComponent"
        rowKey="id"
        :pagination="ipagination"
        :columns="columns"
        :dataSource="dataSource"
        :loading="loading1"
        class="j-table-force-nowrap"
        @change="handleTableChange"
      >
        <a slot="billNo" slot-scope="text, record" @click="getDetail(record)">{{ text }}</a>
      </a-table>
    </div>
    <ErpReportAuditFormModal ref="reportAuditFormModal"></ErpReportAuditFormModal>
  </a-card>
</template>

<script>
import Ellipsis from '@/components/Ellipsis'
import { getAction } from '@/api/manage';
import ErpReportAuditFormModal from './reference/ErpReportAuditFormModal'
import { DragResizable } from '@/mixins/DragResizable'

export default {
  name: 'ErpReportAuditFormList',
  mixins: [ DragResizable ],
  components: {
    Ellipsis,
    ErpReportAuditFormModal
  },
  watch: {
    projectId: {
      handler (val) {
        if (val && this.taskId) {
          this.loadData()
        }
      },
      immediate: true
    },
    taskId: {
      handler (val) {
        if (val && this.projectId) {
          this.loadData()
        }
      },
      immediate: true
    }
  },
  props: {
    // 项目id
    projectId: {
      type: String,
      default: ''
    },
    // 任务id
    taskId: {
      type: String,
      default: ''
    }
  },
  created() {
    this.customKey = 'columns'
    this.columnswidth = this.columns.map(val => {
      return val.width
    })
  },
  data() {
    return {
      /* 排序参数 */
      isorter: {
        column: 'createTime',
        order: 'desc'
      },
      url: {
        list: '/api/erp/omc/reportaudit/erpReportAudit/allLists'
      },
      loading1: false,
      dataSource: [],
      ipagination: {
        current: 1,
        pageSize: 5,
        pageSizeOptions: ['5', '10', '20', '30', '50', '100', '200'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },

      columns: [
          {
            title: '序号',
            dataIndex: '',
            key: 'rowIndex',
            width: 60,
            align: 'center',
            customRender: function (t, r, index) {
              return parseInt(index) + 1;
            }
          },
          {
            title: '单据编号',
            align: 'center',
            dataIndex: 'billNo',
            width: 200,
            scopedSlots: { customRender: 'billNo' },
            ellipsis: true
          },
          {
            title: '申请人',
            align: 'center',
            dataIndex: 'handlerId_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '申请部门',
            align: 'center',
            dataIndex: 'handlerDeptId_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '项目名称',
            align: 'center',
            dataIndex: 'projectId_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '项目负责人',
            align: 'center',
            dataIndex: 'projectLeading_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '生产团队',
            align: 'center',
            width: 143,
            dataIndex: 'productTeam_dictText',
            ellipsis: true
          },
          {
            title: '实施部门',
            align: 'center',
            dataIndex: 'executeDepart_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '签订单位',
            align: 'center',
            dataIndex: 'signUnit_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '业务名称',
            align: 'center',
            dataIndex: 'categoryName',
            width: 143,
            ellipsis: true
          },
          {
            title: '单据类型',
            align: 'center',
            dataIndex: 'billType_dictText',
            width: 143,
            ellipsis: true
          },
          {
            title: '流程状态',
            align: 'center',
            dataIndex: 'bpmStatus_dictText',
            width: 143,
            ellipsis: true
          }
        ]
    }
  },
  methods: {
    getDetail(record) {
      const model = record
      this.model = model;
      this.$nextTick(() => {
        this.$refs.reportAuditFormModal.edit(model);
      })
    },
    clearDeail() {
      this.dataSource = []
    },
    async loadData(arg) {
      this.clearDeail()
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      // 加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1;
      }
      if (!this.projectId) {
          this.dataSource = []
          this.ipagination.total = 0
          return
        }
      let params = {
        projectId: this.projectId,
        taskId: this.taskId
      };
      params.pageNo = this.ipagination.current;
      params.pageSize = this.ipagination.pageSize;
      // 查询条件
      var param = Object.assign({}, params, this.isorter, {});
      this.loading1 = true;
      let res = await getAction(this.url.list, param)
      this.loading1 = false;
      if (res.success) {
        this.dataSource = res.result.records;
        this.ipagination.total = res.result.total;
        // 判断是否当前页没有数据且不为第一页
        if (this.dataSource.length === 0 && this.ipagination.current !== 1) {
          this.ipagination.current = this.ipagination.current - 1
          this.loadData(this.ipagination.current - 1);
        }
      }
      this[this.customKey].forEach((val,index) => {
        val.width = this[this.customKey+'width'][index]
      })
    },

    handleTableChange(pagination, filters, sorter) {
    // 分页变化时触发
      this.ipagination = pagination
      this.loadData()
    }
  }
}
</script>
<style scoped>
</style>
